<template>
  <!-- <a-drawer
    :title="`合同号：${businessCode}`"
    width="1000px"
    placement="right"
    :closable="false"
    :visible="visible"
    @close="onClose"
  > -->
  <div style="padding-top: 50px" v-if="visible">
    <a-row :gutter="[0, 20]">
      <a-col :span="12">
        <a-space size="large">
          <h3>{{ $t('all.autotext1718') }}: {{ businessCode }}</h3>
          <h3>
            {{ $t('all.autotext1731') }}: {{ total }}{{ $t('all.autotext811') }}
          </h3>
          <h3>
            {{ $t('all.autotext1774') }}: {{ canUseAmount
            }}{{ $t('all.autotext811') }}
          </h3>
        </a-space>
      </a-col>
      <a-col :span="12" align="right">
        <a-space>
          <a-button :disabled="status === 1" v-if="$auth('BUSINESS.ENTRY_WARNING')" type="primary" @click="handleWarn">
            {{ $t('all.autotext1732') }}
          </a-button>
          <a-button :disabled="status === 1" v-if="$auth('BUSINESS.ENTRY_ADD')" type="primary" @click="handleAmount">
            {{ $t('all.autotext1837') }}
          </a-button>
          <a-button v-if="$auth('BUSINESS.ENTRY_EXOPRT')" @click="handleExport">
            {{ $t('all.autotext1014') }}
          </a-button>
        </a-space>
      </a-col>
    </a-row>
    <s-table ref="table" size="default" :row-key="(record) => record.id" :data="loadData">
      <a-table-column :title="$t('all.autotext334')" key="id" data-index="id">
        <template slot-scope="text, row, index">
          {{ index | getPageIndex($refs.table) }}
        </template>
      </a-table-column>
      <a-table-column :title="$t('all.autotext1767')" key="orderNumber" data-index="orderNumber">
        <template slot-scope="text">{{ text }}</template>
      </a-table-column>
      <a-table-column :title="$t('all.autotext992')" key="proNo" data-index="proNo">
        <template slot-scope="text">{{ text || '-' }}</template>
      </a-table-column>
      <a-table-column :title="`${$t('all.autotext1838')}-含税(${$t('all.autotext811')})`" key="invoiceMoney"
        data-index="invoiceMoney">
        <template slot-scope="text">{{ typeof text == 'number' ? text.toFixed(2) : '-' }}</template>
      </a-table-column>
      <a-table-column :title="`${$t('all.autotext1734')}-含税(${$t('all.autotext811')})`" key="cashFlowIncludeTax"
        data-index="cashFlowIncludeTax">
        <template slot-scope="text">{{ typeof text == 'number' ? text.toFixed(2) : '-' }}</template>
      </a-table-column>
      <a-table-column :title="`${$t('all.autotext1734')}-未税(${$t('all.autotext811')})`" key="cashFlowBeforeTax"
        data-index="cashFlowBeforeTax">
        <template slot-scope="text">{{ typeof text == 'number' ? text.toFixed(2) : '-' }}</template>
      </a-table-column>

      <!-- <a-table-column :title="$t('all.autotext1076')" key="applicant" data-index="applicant">
        <template slot-scope="text">{{ text }}</template>
      </a-table-column> -->
      <a-table-column :title="$t('all.autotext1795')" key="invoiceTime" data-index="invoiceTime">
        <template slot-scope="text">{{ text }}</template>
      </a-table-column>
      <a-table-column :title="$t('all.autotext1842')" key="cashFlowTime" data-index="cashFlowTime">
        <template slot-scope="text">
          <span v-if="text"> {{ text }}</span>
          <span v-else>-</span>
        </template>
      </a-table-column>
      <a-table-column :title="$t('all.autotext1839')" key="status" data-index="status">
        <template slot-scope="text">
          {{ text | enumValueByKey($const.SH_STATUS) }}
        </template>
      </a-table-column>
      <a-table-column :width="150" :title="$t('all.autotext983')" key="remark" data-index="remark">
        <template slot-scope="text">
          <a-tooltip placement="topLeft">
            <template #title>
              <span>{{ text || '暂无备注信息' }}</span>
            </template>
            <div class="text-overflow">
              {{ text || '-' }}
            </div>
          </a-tooltip>
        </template>
      </a-table-column>
      <a-table-column :title="$t('all.autotext187')" width="120px">
        <template slot-scope="record">
          <a-space>
            <a v-if="Number(record.status) === 0 && $auth('BUSINESS.ENTRY_AUDIT')" @click="handleCheck(record, 1)">{{
              $t('all.autotext1843') }} </a>
            <a v-if="Number(record.status) === 0 && $auth('BUSINESS.ENTRY_AUDIT')" @click="handleRepeal(record)">{{
              $t('all.autotextRepeal') }} </a>
            <a v-if="$auth('BUSINESS.ENTRY_AUDIT')" @click="showModal(record)">{{ $t('all.autotext983') }} </a>
          </a-space>
        </template>
      </a-table-column>
    </s-table>
    <warningSet ref="warnRef" @refresh="warnRefresh" />
    <addAmount ref="amountRef" @refresh="$refs.table.refresh(true)" />
    <examineModal ref="examineRef" @refresh="$refs.table.refresh(true)" />
    <a-modal :visible="remarkVisible" @cancel="remarkVisible = false" :title="$t('all.autotext983')" @ok="submitRemark">
      <a-textarea maxlength="120" :auto-size="{ minRows: 3 }" v-model="remark" placeholder="请输入备注内容" />
    </a-modal>
  </div>
</template>
<script>
import { listContractCashFlow, exportContract, discardContractCashFlow, remarkContractCashFlow } from '@/api/entry/entry'
import warningSet from './warningSet'
import addAmount from './addAmount'
import examineModal from './examineModal'
import { Modal } from 'ant-design-vue'
import { exportExcel } from '@/utils/util'
export default {
  components: { warningSet, addAmount, examineModal },
  props: {
    status: {
      default: 0
    },
    cashFlowType: {
      default: 0
    }
  },
  data() {
    return {
      remarkVisible: false,
      businessCode: '',
      visible: false,
      total: '-',
      remark: '',
      modifyId: '',
      canUseAmount: '-',
      loadData: (parameter) => {
        if (!this.businessCode) return
        return listContractCashFlow({
          businessCode: this.businessCode,
          classify: this.$store.state.user.classify,
          ...parameter
        }).then((res) => {
          this.total = res.proBusCodeCash.totalAmount.toFixed(2)
          this.canUseAmount = res.proBusCodeCash.canUseAmount.toFixed(2)
          return res.pageList
        })
      }
    }
  },
  methods: {
    showModal(record) {
      this.modifyId = record.id
      this.remark = record.remark
      this.remarkVisible = true
    },
    open(record) {
      this.businessCode = record.businessCode
      this.total = '-'
      this.canUseAmount = '-'
      this.visible = true
      this.$nextTick(() => {
        this.$refs.table.refresh(true)
      })
    },
    againOpen() {
      this.$refs.table.refresh(true)
    },
    handleWarn() {
      this.$refs.warnRef.open(this.businessCode, 1)
    },
    handleAmount() {
      this.$refs.amountRef.open(this.businessCode, this.cashFlowType)
    },
    handleCheck(record, type) {
      this.$refs.examineRef.open(record.id, type)
    },
    handleRepeal(record) {
      Modal.confirm({
        title: '废除开票后无法恢复，是否确认废除该次开票？',
        content: '',
        okText: this.$t('all.autotext792'),
        cancelText: this.$t('all.autotext975'),
        onOk: () => {
          discardContractCashFlow({ id: record.id }).then(res => {
            this.$refs.table.refresh(true)
          })
        },
        onCancel() { }
      })
    },
    submitRemark() {
      remarkContractCashFlow({ id: this.modifyId, remark: this.remark }).then(res => {
        this.$refs.table.refresh(true)
        this.remarkVisible = false
      })
    },
    // 导出
    async handleExport() {
      const res = await exportContract({ businessCode: this.businessCode, classify: this.$store.state.user.classify })
      exportExcel(this.$t('all.autotext1755'), res.data)
    },
    warnRefresh() {
      this.$refs.table.refresh(true)
      this.$emit('refresh')
    },
    onClose() {
      this.visible = false
    }
  }
}
</script>
<style scoped>
.text-overflow {
  width: 160px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
</style>